<template>
  <div class="consultation">
    <van-nav-bar
      title="在线问诊"
      left-text="返回"
      left-arrow
      @click-left="onClickLeft"
    />

    <!-- 问诊状态切换 -->
    <van-tabs v-model:active="activeTab" sticky>
      <van-tab title="待接诊" name="waiting">
        <consultation-list
          :list="waitingList"
          :loading="loading"
          :finished="finished"
          @load="onLoad"
          @click="handleConsultation"
        />
      </van-tab>
      <van-tab title="问诊中" name="ongoing">
        <consultation-list
          :list="ongoingList"
          :loading="loading"
          :finished="finished"
          @load="onLoad"
          @click="handleConsultation"
        />
      </van-tab>
      <van-tab title="已完成" name="finished">
        <consultation-list
          :list="finishedList"
          :loading="loading"
          :finished="finished"
          @load="onLoad"
          @click="handleConsultation"
        />
      </van-tab>
    </van-tabs>

    <!-- 结束问诊弹窗 -->
    <van-dialog
      v-model:show="showEndDialog"
      title="结束问诊"
      show-cancel-button
      @confirm="confirmEnd"
    >
      <div class="dialog-content">
        <van-field
          v-model="diagnosis"
          type="textarea"
          rows="3"
          label="诊断建议"
          placeholder="请输入诊断建议"
          :rules="[{ required: true, message: '请输入诊断建议' }]"
        />
      </div>
    </van-dialog>
  </div>
</template>

<script setup>
import { ref, computed, onMounted } from 'vue'
import { useRouter } from 'vue-router'
import { showToast, showDialog } from 'vant'
import ConsultationList from '@/components/ConsultationList.vue'
import { 
  getConsultationList, 
  acceptConsultation, 
  rejectConsultation,
  endConsultation 
} from '@/api/consultation'

const router = useRouter()
const activeTab = ref('waiting')
const loading = ref(false)
const finished = ref(false)
const showEndDialog = ref(false)
const diagnosis = ref('')
const current = ref(1)
const consultationList = ref([])

const onClickLeft = () => {
  router.back()
}

// 根据状态过滤列表
const waitingList = computed(() => 
  consultationList.value.filter(item => item.status === 0)
)
const ongoingList = computed(() => 
  consultationList.value.filter(item => item.status === 1)
)
const finishedList = computed(() => 
  consultationList.value.filter(item => item.status === 2)
)

// 加载问诊列表
const onLoad = async () => {
  try {
    loading.value = true
    const res = await getConsultationList({
      current: current.value,
      size: 10,
      status: getStatusByTab(activeTab.value)
    })
    
    consultationList.value.push(...res.records)
    current.value++
    
    if (consultationList.value.length >= res.total) {
      finished.value = true
    }
  } catch (error) {
    showToast('加载失败：' + error.message)
  } finally {
    loading.value = false
  }
}

// 根据tab获取状态值
const getStatusByTab = (tab) => {
  switch (tab) {
    case 'waiting': return 0
    case 'ongoing': return 1
    case 'finished': return 2
    default: return null
  }
}

// 处理问诊
const handleConsultation = (consultation) => {
  router.push(`/doctor/chat/${consultation.id}`)
}

// 接诊
const handleAccept = async (id) => {
  try {
    await acceptConsultation(id)
    showToast('接诊成功')
    refreshList()
  } catch (error) {
    showToast('接诊失败：' + error.message)
  }
}

// 拒绝接诊
const handleReject = (id) => {
  showDialog({
    title: '提示',
    message: '确认拒绝接诊吗？',
    showCancelButton: true
  }).then(async () => {
    try {
      await rejectConsultation(id)
      showToast('已拒绝')
      refreshList()
    } catch (error) {
      showToast('操作失败：' + error.message)
    }
  })
}

// 继续问诊
const handleContinue = (id) => {
  router.push(`/doctor/chat/${id}`)
}

// 结束问诊
const handleEnd = async (id, diagnosis) => {
  try {
    await endConsultation(id, diagnosis)
    showToast('问诊已结束')
    refreshList()
  } catch (error) {
    showToast('操作失败：' + error.message)
  }
}

// 确认结束问诊
const confirmEnd = async () => {
  if (!diagnosis.value) {
    showToast('请输入诊断建议')
    return
  }
  
  try {
    await endConsultation(currentId.value, diagnosis.value)
    showToast('问诊已结束')
    showEndDialog.value = false
    diagnosis.value = ''
    refreshList()
  } catch (error) {
    showToast('操作失败')
  }
}

// 刷新列表
const refreshList = () => {
  current.value = 1
  consultationList.value = []
  finished.value = false
  onLoad()
}

onMounted(() => {
  onLoad()
})
</script>

<style lang="scss" scoped>
.consultation {
  min-height: 100vh;
  background-color: #f7f8fa;
  
  .dialog-content {
    padding: 16px;
  }
}
</style> 